<?php
use yii\helpers\Html;
use yii\bootstrap\ActiveForm;
use yii\helpers\Url;
$this->title = '编辑区管理';
?>
<?= Html::cssFile('./assets/css/uploadsoft.css')?>
<?= Html::jsFile('./assets/uploadsoft/jquery.min.js')?>
<?= Html::jsFile('./assets/uploadsoft/jquery.form.js')?>
<?= Html::jsFile('./assets/js/systemupload.js')?>
<div class="container">
    <div class="row">
       <?php echo $this->render('_leftnav'); ?>
        <div class="col-md-10">
			<div class="page-header clearfix">
				<h1 class="pull-left">编辑内容</h1>
				<div class="pull-right"></div>
			</div>
		<ul class="nav nav-tabs mbm">
            <li class="active">
                <a href="/admin/block/22/visual/edit">编辑</a>
			</li>
        </ul>
    <style type="text/css">
		.sortable-list .placeholder {
		  margin: 10px 0;
		  width: 100%;
		  height: 40px;
		  background: #FCFFC0;
		  border: 1px dashed #ccc;
		  list-style: none;
		}
		.nav.sortable-list .placeholder {
		  width: 80px;
		  padding: 10px 15px;
		  background: #eee;
		  margin: 0;
		}
		#btn-tabs li {
		  width: 66px;
		}
		.nav.nav-pills .dragged{
		  position: absolute!important;
		}
	</style>
      <!-- <div class="col-md-6"> -->
    <div>
      <h4>雅致简洁主题：首页 - 顶部轮播图</h4>
<!--      <form id="block-edit-form" class="visual-edit-form form-horizontal" method="POST" action="/index.php?r=operate/carouselupdate">-->

              <section id="js-affix-carousel">
      <div class="item-title">
        <strong>轮播图</strong>
        <p class="text-muted">建议使用780*380大小的图片，最多可设置５张图片。</p>
      </div>

      <div class="panel-group sortable-list" id="js-accordion-carousel"  data-code="carousel" data-prefix="data[carousel]" data-count="5" data-role="collapse" role="tablist" aria-multiselectable="true">

	      <!--轮播列表-->
          <?php foreach($group as $k=>$v){ ?>

          <div class="panel panel-default">
            <div class="panel-heading" role="tab" id="carousel-heading-0" data-toggle="collapse" data-parent="#js-accordion-carousel" href="#carousel-collapse-1-0" aria-expanded="false" aria-controls="carousel-collapse-1-0">

              <h4 class="panel-title clearfix">

                <i class="js-move-seq glyphicon glyphicon-move pull-left mrs"></i>

                <!--ellipsis-->
	                <span class="panel-item-title" style="float:left;"><?= Html::encode($v['group_desc'])?></span>
	              <?php if($v['group_isshow'] == "1"){ ?>
						<a class="pull-right status" model="1" href="javascript:void(0)" val="<?= Html::encode($v['group_id'])?>">显示</a>
	              <?php } else { ?>
		              <a class="pull-right status" model="0" href="javascript:void(0)" val="<?= Html::encode($v['group_id'])?>">隐藏</a>
	              <?php } ?>
               <i class="js-expand-icon glyphicon glyphicon-chevron-down pull-right" title="展开" val="<?= Html::encode($v['group_id'])?>"></i>

               <i class="mrs js-remove-btn glyphicon glyphicon-trash pull-right bannergroupdelete" title="删除" val="<?= Html::encode($v['group_id'])?>"></i>

              </h4>

            </div>

            <div id="<?= Html::encode($v['group_id'])?>" class="panel-collapse collapse" role="tabpanel" aria-labelledby="carousel-heading-0">

              <div class="panel-body">
	              <?php foreach($v['banner'] as $key=>$val){ ?>
				 <div class="form-group">
					 <div style="margin-top:35px;" class="control-label col-md-3 col-xs-3">图片名称</div>
				    <div class="col-md-8 col-xs-8">
					    <p>
						<span style="font-size: 14px;width:250px;height:20px;margin-top:38px;display:block;margin-right:10px;float:left;"><?= Html::encode($val['banner_title'])?></span>
					    <img src="http://files.bwphp.com/file/image/show/1160/500?path=<?= Html::encode($val['banner_thumb'])?>" alt="<?= Html::encode(substr($val['banner_desc'],1,18))?>..." width="100px" height="100px">
					    <span style="float:right;margin-top:38px;"><a href="javascript:void(0)" class="bannerdelete" val="<?= Html::encode($val['banner_id'])?>">删除</a>||<a href="javascript:void(0)" class="bannerupdate" val="<?= Html::encode($val['banner_id'])?>" data-target="#bannerupd" data-toggle="modal">修改</a></span>
					    </p>
				    </div>
				 </div>
	              <?php } ?>
              </div>

	            <div class="btn btn-default text-center js-add-btn banner" style="width:100%;margin-top:-10px;margin-bottom:20px;" data-target="#addbanner" val="<?= Html::encode($v['group_id'])?>"  data-toggle="modal">+新增</div>
            </div>
          </div>

          <?php } ?>
                <!--轮播列表结束-->
              </div>
          <div class="btn btn-default text-center js-add-btn bannergroup" style="width:100%;margin-top:-10px;margin-bottom:20px;" data-target="#addbannergroup"  data-toggle="modal">+新增轮播组</div>

    </section>
    </div>
        </div>
    </div>
</div>
<div id="bannerupd" class="modal fade"></div>
<!--新增轮播图开始-->
<div aria-hidden="false" style="display: none;" id="addbanner" class="modal fade in"><div class="modal-dialog ">
		<div class="modal-content">
			<div class="modal-header">
				<button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
				<h4 class="modal-title">新增轮播图片

				</h4>
			</div>
			<div class="modal-body">
				<?php
				$form = ActiveForm::begin([
					'options' => ['class' => 'form-horizontal', 'id'=>'addmodal-body','enctype' => 'multipart/form-data'],
					'action'=>Url::to(['operate/carouseladd']),
					'method'=>'post',
					'fieldConfig' => [
						'template' => '<div class="row form-group"><div class="col-md-3 control-label">{label}</div><div class="col-md-8 controls">{input}
{error}<div class="help-block"
style="display:none;"></div></div></div><p></p>'
					],
				]);
				?>

				<?= $form->field($banner, 'banner_title')->textInput(['maxlength' => 30]); ?>

				<div class="row form-group">
					<div class="col-md-3 control-label">

					</div>
					<div class="col-md-8 controls">
						<img class="picture" id="systemimg" src="" alt="" style="width: 150px;height: 150px;">
						<div class="help-block" style="display:none;">

						</div>
					</div>
				</div>
				<p></p>

				<div class="row form-group">
					<div class="col-md-3 control-label">
					</div>
					<div class="col-md-8 controls">

						<div class="form-group" style="margin-left:0px" >
							<p class="help-block">你可以上传jpg, gif, png格式的文件, 图片建议尺寸至少为480x270。<br>文件大小不能超过<strong>2M</strong>。</p>
							<input type="hidden" id="system_thumb" name="Banner[banner_thumb]">
							<div class="btn" style="">
								<span>添加图片</span>
								<?= Html::fileInput('filedata','', ['id'=>'fileupload']) ?>
							</div>
							<div class="progress" style='margin-left:100px'>
								<span class="bar"></span><span class="percent">0%</span >
							</div>
							<div class="files" style='margin-left:0px'></div>
							<div id="showimg"></div>
						</div>

						<div class="help-block" style="display:none;">

						</div>
					</div>
				</div>
				<p></p>

				<?= $form->field($banner, 'banner_url')->textInput() ?>

				<?= $form->field($banner, 'banner_desc')->textInput() ?>

				<div class="modal-footer">
					<?= Html::Button('取消', ['class' => 'btn btn-bannergroup','data-dismiss'=>'modal']) ?>
					<?= Html::submitButton('保存', ['class' => 'btn btn-primary']) ?>
				</div>
				<?php ActiveForm::end();?>
			</div>
		</div>
	</div>
</div>
<!--新增轮播图结束-->

<!--新增轮播组开始-->
<div aria-hidden="false" style="display: none;" id="addbannergroup" class="modal fade in"><div class="modal-dialog ">
		<div class="modal-content">
			<div class="modal-header">
				<button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
				<h4 class="modal-title">新增轮播组

				</h4>
			</div>
			<div class="modal-body">
				<?php
				$form = ActiveForm::begin([
					'options' => ['class' => 'form-horizontal', 'id'=>'navigation-form'],
					'action'=>Url::to(['operate/carouselgroupadd']),
					'method'=>'post',
					'fieldConfig' => [
						'template' => '<div class="row form-group"><div class="col-md-3 control-label">{label}</div><div class="col-md-8 controls">{input}
{error}<div class="help-block"
style="display:none;"></div></div></div><p></p>'
					],
				]);
				?>

				<?= $form->field($model, 'group_isshow')->radioList(['1'=>'开启','0'=>'关闭']); ?>

				<?= $form->field($model, 'group_desc')->textInput(['maxlength' => 30]) ?>

				<?= $form->field($model, 'group_sort')->textInput() ?>

				<div class="modal-footer">
					<?= Html::Button('取消', ['class' => 'btn btn-bannergroup','data-dismiss'=>'modal']) ?>
					<?= Html::submitButton('保存', ['class' => 'btn btn-primary']) ?>
				</div>
				<?php ActiveForm::end();?>
			</div>
		</div>
	</div>
</div>
<!--新增轮播组结束-->

<script>
	/**
	 * 轮播图展开
	 */
	$(".js-expand-icon").click(function(){
		var attr = $(this).attr("class");
		if(attr == "js-expand-icon glyphicon glyphicon-chevron-down pull-right")
		{
			var val = $(this).attr("val");
			$(".collapse").css("display","none");
			$("#"+val).css("display","block");
			$(this).attr("class","js-expand-icon glyphicon glyphicon-chevron-up pull-right");
		}
		else
		{
			var val = $(this).attr("val");
			$("#"+val).css("display","none");
			$(this).attr("class","js-expand-icon glyphicon glyphicon-chevron-down pull-right");
		}
	})

	/**
	 * 轮播组增加
	 */
	$(".bannergroup").click(function(){
		$("#addbannergroup").css("display","block");
	})

	/**
	 * 轮播图增加
	 */
	$(".banner").click(function(){
		var group_id = $(this).attr("val");
		$("#addmodal-body").append("<input type='hidden' name='Banner[group_id]' value='"+group_id+"'>");
		$("#addbanner").css("display","block");
	})

	/**
	 * 轮播组隐藏
	 */
	$(".btn-bannergroup").click(function(){
		$("#addbannergroup").css("display","none");
		$("#addbanner").css("display","none");
	})
	$(".close").click(function(){
		$("#addbannergroup").css("display","none");
		$("#addbanner").css("display","none");
	})
	$("#close").click(function(){
		$("#bannerupd").css("display","none");
	})

	/**
	 * 轮播删除
	 */
	$(".bannerdelete").click(function(){
		if(window.confirm('你确定要取消交易吗？')) {
			var banner_id = $(this).attr("val")
			$.ajax({
				type: "POST",
				url: "<?php echo Url::to(['operate/bannerdelete'])?>",
				data: "banner_id=" + banner_id,
				success: function (msg) {
					if (msg == "1") {
						alert("删除成功");
						location.reload();
					}
					else {
						alert("删除失败");
					}
				}
			});
		}
	})

	/**
	 * 轮播组删除
	 */
	$(".bannergroupdelete").click(function(){
		if(window.confirm('你确定要取消交易吗？')) {
			var group_id = $(this).attr("val")
			$.ajax({
				type: "POST",
				url: "<?php echo Url::to(['operate/bannergroupdelete'])?>",
				data: "group_id=" + group_id,
				success: function (msg) {
					alert(msg)
					if (msg == "0") {
						alert("非法请求");
						location.reload();
					}
					else if (msg == "1")
					{
						alert("轮播组删除失败");
					}
					else if (msg == "2")
					{
						alert("删除成功");
						location.reload();
					}
					else
					{
						alert("删除失败");
					}
				}
			});
		}
	})

	/**
	 * 轮播修改
	 */
	$(".bannerupdate").click(function(){
		var banner_id = $(this).attr("val");
		$.ajax({
			type: "POST",
			url: "<?php echo Url::to(['operate/bannerupdate'])?>",
			data: "banner_id="+banner_id,
			success: function(msg){
				$("#bannerupd").html(msg)
			}
		});
	})

	/**
	 * 是否展示
	 */
	$(".status").click(function(){
		var group_id = $(this).attr("val")
		var model = $(this).attr("model")
		$.ajax({
			type: "POST",
			url: "<?php echo Url::to(['operate/bannergroupstatus'])?>",
			data: "group_id="+group_id+"&model="+model,
			success: function(msg){
				if(msg == "0")
				{
					alert("非法请求");
				}
				else if(msg == "1")
				{
					alert("修改成功");
					location.reload();
				}
				else
				{
					alert("修改失败");
				}
			}
		});
	})

</script>

<script>
  var app = {};
  app.debug = false;
  app.version = '6.6.2';
  app.httpHost = 'http://dcoffee.edusoho.com.cn';
  app.basePath = '';
  app.theme = 'mooc';
  app.themeGlobalScript = '';
  app.jsPaths = {"common":"common","theme":"\/themes\/mooc\/js","couponbundle":"\/bundles\/coupon\/js","userimporterbundle":"\/bundles\/userimporter\/js","homeworkbundle":"\/bundles\/homework\/js","chargecoinbundle":"\/bundles\/chargecoin\/js","materiallibbundle":"\/bundles\/materiallib\/js","moneycardbundle":"\/bundles\/moneycard\/js","discountbundle":"\/bundles\/discount\/js","vipbundle":"\/bundles\/vip\/js","customwebbundle":"\/bundles\/customweb\/js","customadminbundle":"\/bundles\/customadmin\/js","topxiawebbundle":"\/bundles\/topxiaweb\/js","topxiaadminbundle":"\/bundles\/topxiaadmin\/js","classroombundle":"\/bundles\/classroom\/js"};

  app.crontab = '/common/crontab';

  var CKEDITOR_BASEPATH = app.basePath + '/assets/libs/ckeditor/4.6.7/';

  app.config = {"api":{"weibo":{"key":""},"qq":{"key":""},"douban":{"key":""},"renren":{"key":""}},"cloud":{"video_player":"http:\/\/cdn.staticfile.org\/GrindPlayerCN\/1.0.2\/GrindPlayer.swf","video_player_watermark_plugin":"http:\/\/cdn.staticfile.org\/GrindPlayerCN\/1.0.2\/Watermake-1.0.3.swf","video_player_fingerprint_plugin":"http:\/\/cdn.staticfile.org\/GrindPlayerCN\/1.0.2\/Fingerprint-1.0.1.swf"},"loading_img_path":"\/assets\/img\/default\/loading.gif?6.6.2"};

  app.arguments = {};
      app.controller = 'block/visual-edit';

  app.scripts = null;

  app.uploadUrl = '/file/upload';
  app.imgCropUrl = '/file/img/crop';
  app.lessonCopyEnabled = '1';

  app.mainScript = '/bundles/topxiaadmin/js/admin-app.js?6.6.2';
</script>
<script src="/assets/libs/seajs/seajs/2.2.1/sea.js?6.6.2"></script>
<script src="/assets/libs/seajs/seajs-style/1.0.2/seajs-style.js?6.6.2"></script>
<script src="/assets/libs/seajs-global-config.js?6.6.2"></script>
<script>
  seajs.use(app.mainScript);
</script>
<div id="modal" class="modal" ></div>
</body>
</html>


<!--
<div class="form-group">
				    <div style="margin-top:35px;" class="control-label col-md-3 col-xs-3">图片名称</div>
				    <div class="col-md-8 col-xs-8">
					    <p>
						<span style="font-size: 14px;width:200px;height:20px;background:red;margin-top:38px;display:block;margin-right:200px;float:left;">12312ffffffffffffffffffffffffffffffffffffffff3ss</span>
                <img width="100px" height="100px" src="uploads/friendlink/14487702333318.png" alt="1232134789087654321345678908765432">
					    <span style="float:right;margin-top:38px;"><a>删除</a>||<a>修改</a></span>

					    </p>
				    </div>
				 </div>

-->